<extend name="Manage/themes/default/base" />
<block name="main">
    <div class="layui-fluid">
        <div class="layui-row layui-col-space15">
            <div class="layui-col-md12">
                <div class="search-toolbar layui-form">
                    <div class="search-toolbar-left">
                        <form class="layui-form layui-col-space5">
                            <div class="layui-inline search-toolbar-item">
                        <span class="layui-inline">
                            <input type="text" id="keywords" placeholder="名称/编号" autocomplete="off" class="layui-input" size="40">
                        </span>
                            </div>
                            <div class="layui-inline search-toolbar-item">
                                <button type="button" class="layui-btn search-btn" onclick="List.searchList()">查询</button>
                            </div>
                        </form>
                    </div>
                    <div class="search-toolbar-right">
                        <a href="javascript:void(0)" onclick="List.openDetailWindow(0)" class="layui-btn layui-btn-green">添加</a>
                    </div>
                </div>



                <div class="layui-card">
                    <div class="layui-card-body ">
                        <table class="layui-table" id="list" lay-filter="list"></table>
                    </div>
                    <div class="layui-card-body" >
                        <div id="page" class="layui-page"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <script type="text/html" id="barRows">
        <a class="layui-btn layui-btn-xs" lay-event="edit"><i class="layui-icon">&#xe642;</i>编辑</a>
        <a class="layui-btn-danger layui-btn layui-btn-xs" lay-event="delete"><i class="layui-icon">&#xe640;</i>删除</a>
    </script>
    <script>
        var table,laypage;
        layui.use(['table','laypage'], function(){
            table = layui.table;
            laypage = layui.laypage;
            List.getList(1);
            table.on('tool(list)', function (obj) {
                List.rowBarEvent(obj);
            });
        });
        var List = {
            canOperate:true,
            rowBarEvent:function(obj){
                var data = obj.data;
                switch(obj.event){
                    case 'edit':
                        List.openDetailWindow(data.id);
                        break;
                    case 'delete':
                        List.deleteData(data.id);
                        break;
                }
            },
            searchParam:{ //搜索字段
                'limit':10, //默认分页条数
                'page':1
            },

            /**
             * 打开详细界面
             */
            openDetailWindow:function(id){
                var url = VK.U('modules/pages/'+id);
                VK.openPoerWindow('详情', url, 0, 850, 550);
            },
            getList:function(page){
                List.searchParam.page = page;
                var loading = VK.load();
                VK.QAjax(VK.U('modules'),'get',List.searchParam,function(res){
                    VK.closeLoad(loading);
                    var data = res.data;
                    List.rendListHtml(data.data);
                    List.rendPager(data.total,data.per_page,data.current_page);
                });
            },
            /**
             * 渲染分页条
             */
            rendPager:function(total,per_page,current_page){
                laypage.render({
                    elem : 'page',  //id
                    count : total,  //总数据
                    limit : per_page,//一页多少数据
                    curr : current_page,//当前页
                    theme : '#015293',        //颜色设置
                    layout : ['count', 'prev', 'page', 'next',  'skip', 'limit'],     //分页的配置
                    jump:function(obj,first) {
                        List.searchParam.limit = obj.limit;
                        //首次不执行
                        if(!first){
                            List.getList(obj.curr);
                        }
                    }
                });
            },
            /**
             * 渲染列表表格
             */
            rendListHtml:function(data){
                table.render({
                    elem: '#list',
                    defaultToolbar: [],
                    text: {
                        none: '暂无相关数据'
                    },
                    data: data,
                    page:false, //开启分页
                    done: function (res, curr, count) {},
                    cols: [[
                        {field: 'id', title: 'ID',width:"8%",align:"center"},
                        {field: 'name', title: '名称',width:"30%",align:"center"},
                        {field: 'code', title: '编号', width:"12%",align:"center"},
                        {field: 'describe', title: '说明', width:"30%",align:"center"},
                        {title: '操作',toolbar:"#barRows",width:"20%",align:"center"},
                    ]],
                    limit: List.searchParam.limit //显示的数量
                });
                $(".layui-table td").click(function(e){
                    if($(this).find('.layui-form-checkbox').length<=0){
                        $(this).closest('tr').find('.layui-form-checkbox').find('i').click();
                    }
                });
            },
            deleteData:function(id){
                VK.confirm({content:"确定删除",yes:function(){
                        layer.closeAll();
                        List.canOperate = false;
                        var loading = VK.load();
                        VK.QAjax(VK.U('modules/'+id),'delete',{},function(res){
                            VK.closeLoad(loading);
                            List.canOperate = true;
                            if(res.status!= 200){
                                VK.error(res.msg);
                                return false;
                            }
                            VK.success('删除成功');
                            List.getList(List.searchParam.page);
                        },function(res){
                            List.canOperate = true;
                            VK.error('请求出错请重试');
                        });
                    }});
            },
            /**
             * 搜索
             */
            searchList:function(){
                List.searchParam.keywords = $('#keywords').val();
                List.getList(1);
            },
        }

        function reloadList(){
            List.getList(List.searchParam.page);
        }
    </script>
</block>